<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
</head>
<body >
<div th:fragment="main_footer" id="main_footer">
    <!--尾部-->
    <footer class="mainfooter">
        <div class="container">
            <!--关于博客-->
            <div class="row">
                <div class="col-md-6 col-lg-3">
                    <div class="footer_block">
                        <h4 class="widget_title">关于博客</h4>
                        <div class="textwidget">
                            <!--内容-->
                            <p>“秋风生渭水，落叶满长安”</p>
                            <br>
                            <p>&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;——贾岛</p>
                        </div>
                    </div>
                </div>
                <!--循环标签-->
                <div class="col-md-6 col-lg-3">
                    <div class="footer_block widget_tag_cloud">
                        <h4 class="widget_title">标签</h4>
                        <div class="tagcloud" id="footer_tag_a">
                            <!--标签信息-->
                        </div>
                    </div>
                </div>
                <!--循环分类-->
                <div class="col-md-6 col-lg-3">
                    <div class="footer_block widget_categories">
                        <h4 class="widget_title">分类</h4>
                        <ul id="footer_category_ul">

                        </ul>
                    </div>
                </div>
                <!--联系我们-->
                <div class="col-md-6 col-lg-3">
                    <div class="footer_block">
                        <h4 class="widget_title">联系我们</h4>
                        <div class="wp_subscribe">
                            <form action="#">
                                <input type="text" name="email" placeholder="Your email" required autocomplete="off">
                                <button class="btn_gurd"><i class="icon-mail-alt"></i></button>
                            </form>
                        </div>
                    </div>

                </div>
            </div>
            <!--Social 图标-->
            <div class="socials_footer">
                <a href="#"><i class="iconfont icons-QQ" v-show="!isCollapse"></i></a>
                <a href="#"><i class="iconfont icons-weibo" v-show="!isCollapse"></i></a>
                <a href="#"><i class="iconfont icons-weixing" v-show="!isCollapse"></i></a>
            </div>
            <div class="site_copy">
                Copyright © 2021. Ain Blog
            </div>
        </div>
    </footer>
    <!--END main footer -->
    <script th:inline="javascript">
        $(function () {
            //查询分类信息
            $.ajax({
                async: true,
                url: "/queryAllCategory",
                type: "get",
                success: function (data) {
                    $.each(data, function (i, item) {
                        var $li = $(
                            "<li style=\"height: 20px;overflow: hidden;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 1;\"><a href='/category_subpage/" + item.categoryId + "' title='" + item.categoryName + "'>"+item.categoryName+"</a></li>"
                        );
                        $("#footer_category_ul").append($li);
                    })
                }
            });
            //查询标签信息
            $.ajax({
                async: true,
                url: "/queryAllTag",
                type: "get",
                success: function (data) {
                    $.each(data, function (i, item) {
                        var $a = $(
                            "<a href='/tag_subpage/"+ item.tagId + "' title='" + item.tagName + "'>"+item.tagName+"</a>"
                        );
                        $("#footer_tag_a").append($a);
                    })
                }
            });
        })
    </script>
</div>
</body>
</html>